* { box-sizing: border-box; }
html,body {margin: 0;padding: 0;width: 100%;}
/*body {padding-bottom: 15px;}*/
.main-container {width: 100%;height: 600px;}
.left-detail { width: 220px;height: 600px;float: left;background-color: rgb(246,246,246);border-right: 1px solid rgb(192,192,192);padding-left: 20px;font-size: 12px;}
.left-detail .title-text {width: 180px; height:35px; line-height: 35px;color: black;font-weight: bold;border-bottom: 2px solid rgb(42, 111, 181);margin-top: 5px;font-size: 13px;}
.left-detail .info-item {height: 30px;line-height: 30px;}
.left-detail .legend {line-height: 25px;width:180px;border-bottom:2px solid rgb(42, 111, 181) !important;}
.left-detail .legend tr td:nth-child(1) { width:47px;text-align: right;padding-right: 5px;}
.left-detail .legend tr td:nth-child(1) { text-align: left;}
.left-detail .legend .focus-house {width: 60px;height: 25px;float: right;background: url(../../img/gis/focusRoom.jpg) no-repeat center;background-size: 100%;
}
.left-detail .legend .rent-house {width: 60px;height: 25px;float: right;
    background: url(../../img/gis/rentRoom.jpg) no-repeat center; background-size: 100%;
}
.left-detail .table-detail {line-height: 30px;width:180px;border-bottom:2px solid rgb(42, 111, 181) !important;}
.left-detail .table-detail tr td:nth-child(1) {width: 70px;text-align: left;/* font-weight: bold; */vertical-align: top;}
.left-detail  .right-legend {height: 25px;    padding-right: 10px;}
.left-detail  .right-legend>div {float: right;height: 20px;line-height: 20px}
.left-detail  .right-legend .legend-div {width: 50px;text-align: center;color: black;}
.left-detail  .right-legend .legend-text {width:138px;text-align: left;padding-left: 5px;}
.right-building { width:calc(100% - 220px);height: 100%;float: left;padding-top: 20px;padding-bottom: 15px;}
.right-building .whole-building {margin: auto;display: flex;flex-direction: column;height:100%;overflow: auto; }
.right-building .whole-building .top-building { height: 65px;
  background: url(../../img/gis/buildingTop.jpg) no-repeat center;
  background-size: 100% 100%; width:562px; margin: 0 auto;
}
.right-building .whole-building .bottom-building {display: flex;flex-direction: row; flex-wrap: nowrap;}
.right-building .whole-building .bottom-building .units {display: flex;flex-direction: column-reverse;border:3px solid rgb(115, 66, 36);border-left: none;padding: 5px;}
.right-building .whole-building .bottom-building .units:first-child {margin-left: auto;border-left:3px solid rgb(115, 66, 36);}
.right-building .whole-building .bottom-building .units:last-child {margin-right: auto; font-size: 12px;}
.right-building .whole-building .bottom-building .units .floors {display: flex;flex-direction: row;}
.right-building .whole-building .bottom-building .units .floors .rooms {
    width: 75px; height:30px;
    line-height: 30px;
    text-align: center;
    color: black;margin: 2px 4px; cursor: pointer;
     background-color: rgb(210,210,210);
    /*background:url(../../img/gis/noRoomData.jpg) no-repeat;*/
    background-size:100%;    border: 1px solid #e0dfdf;}
.right-building .whole-building .bottom-building .units .floors .exit-room {
    text-indent: 13px;
    line-height: 23px;
    text-align: left;
    /*background:url(../../img/dym.jpg) no-repeat;*/
    background-size:100%;
    background-color: yellowgreen;
}
.right-building .whole-building .bottom-building .units .floors .rent-room {
    /*background: url(../../img/gis/rentRoom.jpg) no-repeat center;*/
    background-color: #f8ac59;
    background-size:100%;
    /*border: 1px solid darkred;*/
}
.right-building .whole-building .bottom-building .units .floors .focus-room {
    background-color: #ed5565;

    /*background: url(../../img/gis/focusRoom.jpg) no-repeat center;*/
    background-size:100%;
    /*border: 1px solid rgb(236,153,42);*/
}
.right-building .whole-building .bottom-building .units .floors .current-room {
    /*text-align: center;*/
    /*line-height: 30px;*/
    /*text-indent: 0;*/
    background: #ff7a19;
    /* background: url(../../img/gis/currentRoom.jpg) no-repeat center; */
    background-size:100%;
    /*border: 1px solid rgb(236,153,42);*/
}
.right-building .whole-building .bottom-building .units .floors .rent-focus-current {
    /*background: url(../../img/gis/rentFocusCurrentRoom.jpg) no-repeat center;*/
    background-color: #ed5565;
    background-size:100%;
}
.right-building .whole-building .bottom-building .units .floors .rent-current {
    background-color: #f8ac59;

    /*background: url(../../img/gis/rentCurrentRoom.jpg) no-repeat center;*/
    background-size:100%;
}
.right-building .whole-building .bottom-building .units .floors .focus-current {
    background-color: #ed5565;

    /*background: url(../../img/gis/focusCurrentRoom.jpg) no-repeat center;*/
    background-size:100%;
}
.right-building .whole-building .bottom-building .unit-name-container { height:47px; padding-top: 8px;}
.right-building .whole-building .bottom-building .unit-name-container .unit-name { /* background-color: rgb(255,139,15); */margin: auto;text-align: center;width:75px;height:38px;line-height:45px;border-radius: 5px;color: #dfc2ab;
  background:url(../../img/gis/dyp.png) no-repeat;
   background-size:100%;}



